<!DOCTYPE html>
<html>
<head>
	<title>box-shadow</title>
	<meta charset="utf-8">
	<style type="text/css">
	html{
		background-color: #eee;
	}
		.squre{
			margin: 100px 500px;
			width: 100px;
			height: 200px;
			background-color: #fff;
			box-shadow:none;
			border-radius: 10px;
			color: #fff;
			text-align: center;
			transition: box-shadow .5S,transform .5s,color 1s;
		}
		.squre:hover{
			box-shadow: 0px 10px 20px  #ccc;
			color: #666;
			transform: translate(0px,5px);
		}
		.suqre .a1{
			color: red;
		}
		.suqre .a2:hover{
			display: none;
			
		}
	</style>
</head>
<body>
	<div class="squre">
		<span class="a1">Hello world</span>
		<span class="a1">Hello world</span>
		<span class="a2"> Hello world Hello world Hello world Hello world Hello world Hello worldHello world Hello world Hello </span>
	</div>
</body>
<!-- <script type="text/javascript">
	function removeWithoutCopy(arr, item) {
	for(var i=arr.length-1;i>=0;i--){
        if(arr[i]===item){
            arr.splice(i,1)
        }
    }
    return arr
}

console.log(removeWithoutCopy([8,2,3,8,5,6,7,8,9], 8))
</script> -->
</html>